<template>
  <div>
    <el-button @click="addBtn()">新增</el-button>
    <el-button v-if="selected!=0" @click="update()">修改</el-button>
    <el-button v-if="selected!=0" @click="del()">删除</el-button>
    <el-button v-if="selected!=0" @click="ck()">查看</el-button>
    <div><!-- 显示table的div -->
      <el-form :data="searchArgs" :inline="true"><!-- 查询条件表单 -->
        <el-form-item label="需求主题">
          <el-input v-model="searchArgs.needSubject" placeholder="请输入需求主题"></el-input>
        </el-form-item>
        <el-form-item label="填报人">
          <el-input v-model="searchArgs.applyer" placeholder="请选择或输入填报人"></el-input>
        </el-form-item>
        <el-form-item label="起止日期">
          <el-date-picker type="date" value-format="yyyy-MM-dd" v-model="searchArgs.sdate"></el-date-picker>--
          <el-date-picker type="date" value-format="yyyy-MM-dd" v-model="searchArgs.edate"></el-date-picker>
        </el-form-item>
        <el-form-item label="审批状态">
          <el-select v-model="searchArgs.approveStatus">
            <el-option label="-" value=""></el-option>
            <el-option label="审批中" value="1"></el-option>
            <el-option label="审批不通过" value="2"></el-option>
            <el-option label="审批通过" value="3"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="getNeedList()">查询</el-button>
        </el-form-item>
      </el-form>
      <el-table :data="needs" style="width:100%">
        <el-table-column>
          <template slot-scope="scope">
            <el-radio v-model="selected" :label="scope.row.id">{{''}}</el-radio>
          </template>
        </el-table-column>
        <el-table-column label="序号" prop="id"></el-table-column>
        <el-table-column label="需求主题" prop="needSubject"></el-table-column>
        <el-table-column label="计划主题" prop="planId"></el-table-column>
        <el-table-column label="编制人" prop="applyer"></el-table-column>
        <el-table-column label="日期" prop="date"></el-table-column>
        <el-table-column label="审批" prop="approveStatus" :formatter="approveFormat"></el-table-column>
      </el-table>
    </div>
  </div>  
</template>
<script>
import MaterialNeedModel from "../../model/lyz/MaterialNeedModel"
const MNM=MaterialNeedModel.getInstance();
export default{
  data(){
    return{
      needs:[],//计划信息
      searchArgs:{},//查询参数
      selected:0,//选中的序号
      need:{},//单个need
      details:[],//对应的details
      updateDialog:false,//修改对话框
      infoDialog:false,//信息对话框
    }
  },
  created(){
    this.getNeedList();
  },
  methods:{
    getNeedList(){//查询计划信
      MNM.getNeed(this.searchArgs).then((response)=>{
        this.needs=response.data.data;
      })
    },
    approveFormat(row){//将审批状态转换成字符串
      if(row.approveStatus==1){
        return "审批中";
      }else if(row.approveStatus==2){
        return "审批不通过";
      }else if(row.approveStatus==3){
        return "审批通过"
      }
    },
    addBtn(){//点击新增按钮时 , 跳转路由到新增计划
      this.$router.push("/MaterialNeed");
    },
    del(){
      MNM.delNeed(this.selected).then(()=>{this.getNeedList()})
    },
    update(){
      MNM.getNeed(this.selected).then((response)=>{this.need=response.data.data})
    },
    ck(){

    }
  }
}
</script>